<!doctype html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
        integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <link rel="stylesheet" href="template/style.css" />
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
        integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
        crossorigin="anonymous"></script>
    <script src="template/filters.js"></script>
    <script src="template/chosen.jquery.min.js" type="text/javascript"></script>
    <title>Report</title>
</head>

<body>
    <div class="main">
        <h2>Operations coverage summary: {{report_tag}} {{ timestamp }}</h2>
        <div class="legend">
            <div>
                <span class="border colorRed">Acosh-4</span><span>Not verified Ngraph references</span>
            </div>

            <div>
                <span class="table-primary border"></span><span>Collected statistic info</span>
            </div>
            <div>
                <span class="table-secondary border">N/A</span><span>No Tests</span>
            </div>
            <div>
                <span><b>Status:</b></span>
                <span class="green">P:85</span><span>Passed</span>
                <span class="red">F:0</span><span>Failed</span>
                <span class="grey">S:2</span><span>Skipped</span>
                <span class="dark">C:0</span><span>Crashed</span>
            </div>
        </div>
    </div>
    <!-- Filters block -->
    <div class="filters">
        <form id="filters">
            <div class="form-group">
                <label for="operationName"><b>Operation Name</b></label>
                <input id="operationName" type="text" class="form-control" />
            </div>
            <div class="form-group">
                <label for="opsetNumber"><b>Opset Number</b></label>
                <select id="opsetNumber" class="form-control"></select>
            </div>
            <div class="form-group">
                <label for="references"><b>Ngraph references</b></label>
                <select id="references" class="form-control">
                    <option value="0">All</option>
                    <option value="v">Verified</option>
                    <option value="nv">Not verified</option>
                </select>
            </div>
            <div class="form-group">
                <label for="devices"><b>Devices</b></label>
                <select id="devices" class="form-control"></select>
            </div>


            <div class="form-group col-5" style="padding-left:0">
                <label for="status"><b>Status</b></label>
                <select id="status" class="form-control" multiple>
                    <option value="p">100% Passed</option>
                    <option value="f">Failed</option>
                    <option value="s">Skipped</option>
                    <option value="c">Crashed</option>
                    <option value="ex">Existing tests</option>
                    <option value="na">No tests</option>
                </select>
            </div>
            <button type="submit" class="btn btn-primary">Apply filters</button>
            <button type="button" class="btn btn-secondary" id="reset">Reset filters</button>
        </form>
    </div>

    <!-- Results -->
    <table class="table table-hover" id="report">
        <thead>
            <tr>
                <th class="table-dark" scope="col" style="position: sticky; top: 97px">Operation</th>
                {% for d in devices -%}
                <th class="table-dark device {{ d }}" style="position: sticky; top: 97px">{{ d }}</th>
                {% endfor %}
            </tr>
        </thead>
        <tbody id="statistic">
            <tr>
                <th class="table-primary" scope="row">Total: <i>{{ordered_ops|length}}</i></th>
                {% for d in devices -%}
                <td class="table-primary {{ d }} test_total">{{results[d]|length}}</td>
                {% endfor %}
            </tr>
            <tr>
                <th class="table-primary" scope="row">Trusted op (passrate=100%):</th>
                {% for d in devices -%}
                <td class="table-primary  {{ d }} trusted-ops">{{trusted_ops[d]}} %</td>
                {% endfor %}
            </tr>
            <tr>
                <th class="table-primary" scope="row">Tested op counter:</th>
                {% for d in devices -%}
                <td class="table-primary  {{ d }} tested-ops_count">{{general_test_count[d]}}</td>
                {% endfor %}
            </tr>
            <tr>
                <th class="table-primary" scope="row">AVG passrate per op (=sum_pass_rates/covered_ops_num):</th>
                {% for d in devices -%}
                <td class="table-primary  {{ d }} avg_pass_rate">{{pass_rate_avg[d]}} %</td>
                {% endfor %}
            </tr>
            <tr>
                <th class="table-primary" scope="row">General passrate (=passed_tests/all_tests):</th>
                {% for d in devices -%}
                <td class="table-primary  {{ d }} general_pass_rate">{{general_pass_rate[d]}} %</td>
                {% endfor %}
            </tr>
        </tbody>
        <tbody id="data">
            {% for op in ordered_ops -%}
            <tr>
                <th scope="row" {% if op not in verified_operations -%} class="colorRed" {% endif -%} name="{{ op }}">{{
                    op }}</th>

                {% for d in devices -%}
                {% if op in results[d] -%}
                <td class="value {{ d }}" passed="{{ results[d][op].passed }}" failed="{{ results[d][op].failed }}"
                    skipped="{{ results[d][op].skipped }}" crashed="{{ results[d][op].crashed }}"
                    value="{{ results[d][op].passrate }}">
                    {{ results[d][op].passrate }} %<br />
                    <span class="green" title="Passed">P:{{ results[d][op].passed }}</span>
                    <span class="red" title="Failed">F:{{ results[d][op].failed }}</span>
                    <span class="grey" title="Skipped">S:{{ results[d][op].skipped }}</span>
                    <span class="dark" title="Crashed">C:{{ results[d][op].crashed }}</span>
                </td>
                {% else -%}
                <td class="table-secondary {{ d }}">N/A</td>
                {% endif -%}

                {% endfor %}
            </tr>
            {% endfor -%}

        </tbody>
    </table>
    <div id="message" style="display:none">
        There is no data related to selected filters. Please set new filters.
    </div>
</body>

</html>
